<template>
  <view>
    <headersss title='我的团队'></headersss>

    <view class="content">

      <view class="content_top">
        <view class="">
          <view class="number">9</view>
          <view class="number2">团队总人数</view>
        </view>
        <view class="line"></view>
        <view class="">
          <view class="number">25</view>
          <view class="number2">订单总数</view>
        </view>
      </view>

      <view class="content_bottom">
        <view class="title">全部成员</view>

        <view class="member" v-for="item in 4">
          <image src="../../static/imgs/Rectangle 548.png" mode=""></image>
          <view class="">
            <view class="name">一级成员名字</view>
            <view class="time">加入时间2023-3-16 </view>
          </view>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
  export default {
    data() {
      return {

      };
    }
  }
</script>

<style lang="scss" scoped>
  .content {
    margin: 50rpx 32rpx;
    // padding: 32rpx;
    position: absolute;
    top: 156rpx;

    .content_top {
      display: flex;
      justify-content: space-around;
      align-items: center;
      text-align: center;
      padding: 32rpx;
      width: 686rpx;
      height: 156rpx;
      background: #FFFFFF;
      border-radius: 20rpx 20rpx 20rpx 20rpx;

      .line {
        width: 1rpx;
        height: 64rpx;
        border: 2rpx solid #DCDCDC;
      }

      .number {
        margin-bottom: 10rpx;
        font-size: 48rpx;
        font-family: PingFang SC-Heavy, PingFang SC;
        font-weight: 800;
        color: #EFBC00;
      }

      .number2 {
        font-size: 24rpx;
        font-family: PingFang SC-Medium, PingFang SC;
        font-weight: 500;
        color: #666666;
      }
    }

    .content_bottom {
      margin-top: 32rpx;
      padding-top: 48rpx;
      padding-bottom: 284rpx;
      width: 686rpx;
      // height: 940rpx;
      background: #FFFFFF;
      border-radius: 20rpx 20rpx 20rpx 20rpx;

      .title {
        margin-bottom: 56rpx;
        width: 120rpx;
        margin-left: 38rpx;
        padding-bottom: 10rpx;
        font-size: 28rpx;
        font-family: PingFang SC-Heavy, PingFang SC;
        font-weight: 800;
        color: #333333;
        border-bottom: 8rpx solid #FDCB14;
      }

      .member {
        display: flex;
        margin-bottom: 32rpx;
        padding-bottom: 32rpx;
        border-bottom: 1px solid #efefef;

        >image {
          margin-left: 32rpx;
          margin-right: 20rpx;
          width: 80rpx;
          height: 80rpx;
          border-radius: 50%;
        }

        .name {
          margin-bottom: 7rpx;
          font-size: 28rpx;
          font-family: PingFang SC-Medium, PingFang SC;
          font-weight: 500;
          color: #333333;
        }

        .time {
          font-size: 24rpx;
          font-family: PingFang SC-Medium, PingFang SC;
          font-weight: 500;
          color: #999999;
        }
      }

      .member:last-child {
        border: none;
      }
    }
  }
</style>